<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title></title>
    <link href="css/hiprint.css" rel="stylesheet" />
    <link href="css/print-lock.css" rel="stylesheet" />
    <link href="css/hinnn.css" rel="stylesheet" />
    <link href="content/bootstrap.min.css" rel="stylesheet" />
    <script src="plugins/jquery.min.js"></script>
    <script src="content/bootstrap.min.js"></script>
    <!--测试专用  单独使用无需引入 ]]  -->
    <!--单独使用无需引入  -->
    <script src="hiprint.config.js"></script>
    <script src="polyfill.min.js"></script>
    <script src="plugins/jquery.minicolors.min.js"></script>
    <script src="plugins/JsBarcode.all.min.js"></script>
    <script src="plugins/qrcode.js"></script>
    <script src="hiprint.bundle.js"></script>
    <script src="plugins/jquery.hiwprint.js"></script>
    <script>
      var hiprintTemplate
      $(document).ready(function () {
        hiprint.init()
      })
      const handleMessage = function (event) {
        if (event.data) {
          if (event.data.type !== 'hiprint') {
            return
          }
          delete event.data.type
          hiprintTemplate = new hiprint.PrintTemplate({
            template: event.data.template,
          })
          if (event.data.opt === 'setData') {
            const mHtmlList = hiprintTemplate.getHtml(event.data.record || {})
            const printRootView = document.querySelector('#print-root-view')
            for (let index = 0; index < mHtmlList.length; index++) {
              printRootView.appendChild(mHtmlList[0])
            }
          }
          if (event.data.opt === 'print') {
            hiprintTemplate.print(event.data.record || {})
            hiprintTemplate.on('printSuccess', function (data) {
              console.log('print success', data)
            })
            hiprintTemplate.on('printError', function (data) {
              console.log('print error', data)
            })
          }
        }
      }
      window.addEventListener('message', handleMessage)
    </script>
  </head>
  <body>
    <div id="print-root-view"></div>
  </body>
</html>
